<template>
  <view class="login">
    <view class="content">
      <!-- 头部logo -->
      <view class="header">
        <image :src="logoImage" mode="aspectFit"></image>
      </view>
      <!-- 主体表单 -->
      <view class="main">
        <wInput v-model="phoneData" type="text" maxlength="11" placeholder="用户名/电话"></wInput>
        <wInput v-model="passData" type="password" maxlength="11" placeholder="密码"></wInput>
      </view>
      <wButton text="登 录" :rotate="isRotate" @click.native="startLogin()" class="wbutton"></wButton>

      <!-- 底部信息 -->
      <view class="footer">
        <navigator url="/pages/forget/forget" open-type="navigate">找回密码</navigator>
        <text>|</text>
        <navigator url="/pages/register/register" open-type="navigate">注册账号</navigator>
      </view>
    </view>
  </view>
</template>

<script>
var _this
import wInput from '@/components/watch-login/watch-input.vue' //input
import wButton from '@/components/watch-login/watch-button.vue' //button

export default {
  data() {
    return {
      //logo图片 base64
      logoImage: '/static/logo.jpg',
      phoneData: '', //用户/电话
      passData: '', //密码
      isRotate: false //是否加载旋转
    }
  },
  components: {
    wInput,
    wButton
  },
  mounted() {
    _this = this
		if (uni.getStorageSync('account')) {
			this.phoneData = uni.getStorageSync('account')
		}
		if (uni.getStorageSync('pwd')) {
			this.passData = uni.getStorageSync('pwd')
		}
    //this.isLogin();
  },
  methods: {
    isLogin() {
      //判断缓存中是否登录过，直接登录
      // try {
      // 	const value = uni.getStorageSync('setUserData');
      // 	if (value) {
      // 		//有登录信息
      // 		console.log("已登录用户：",value);
      // 		_this.$store.dispatch("setUserData",value); //存入状态
      // 		uni.reLaunch({
      // 			url: '../../../pages/index',
      // 		});
      // 	}
      // } catch (e) {
      // 	// error
      // }
    },
    startLogin() {
      //登录
      if (this.isRotate) {
        //判断是否加载中，避免重复点击请求
        return false
      }
      if (this.phoneData.length == '') {
        uni.showToast({
          icon: 'none',
          position: 'bottom',
          title: '用户名不能为空'
        })
        return
      }
      if (this.passData.length < 5) {
        uni.showToast({
          icon: 'none',
          position: 'bottom',
          title: '密码不正确'
        })
        return
      }

      console.log('登录成功')

      _this.isRotate = true
      uni.showLoading({
      	title: '登录中'
      })
      let params = {
        account: this.phoneData,
        pwd: this.passData
      }
      this.$api.login(params).then(res => {
        if (res.success) {
          uni.setStorageSync('userInfo', res.rows)
          uni.setStorageSync('account', this.phoneData)
          uni.setStorageSync('pwd', this.passData)
          uni.showToast({
            icon: 'success',
            title: '登录成功'
          });
          setTimeout(() => {
            uni.switchTab({
                url: '/pages/home/home/index'
            })
          }, 500)
        } else {
					uni.hideLoading()
          uni.showToast({ title: res.msg, icon: 'none' })
        }
        _this.isRotate = false
      }).catch(err => {
        uni.hideLoading()
        console.log('request fail', err)
      })
    }
  }
}
</script>

<style lang="scss" scoped>
@import url('./css/main.css');
</style>
